import React, { Component } from 'react';
import { Scroller, Touchable,List } from '$yo-component';
import Header from '$component/header/index.js';
import Footer from '$component/footer/index.js';
import yoHistory from '$common/history';
import './index.scss';

class My extends Component {
    // constructor() {
    //     super();
    //     this.state = {
    //         dataSource: getRandomDataSource(25)
    //     };
    // }

    // refresh() {
    //     this.setState({ dataSource: getRandomDataSource(25) });
    // }

    // fetch() {
    //     this.setState({ dataSource: this.state.dataSource.concat(getRandomDataSource(15)) });
    // }

    render() {
        var style={height: '12px'}
        return (
            <div className="yo-flex">
                <Header title="我的" left={false}/>
                <Scroller extraClass="flex">
                    <div className="m-content">
                        <div className="yo-list">
                            <div className="item titlecss">
                                <div className="yo-card">
                                    <div className="bd cols">
                                        <img className="img-cover" src="http://pic5.duowan.com/psp/1005/138297782616/138298560095.jpg" alt="示例图片"/>
                                        <div className="flex">
                                            <h4 className="title">马娟</h4>
                                            <p className="desc"><i className="iconfont icon-ziliaoxiangqing-gerenziliao-chushengriqi"></i>：2017/5/25</p>
                                        </div>
                                    </div>
                                </div>   
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-jiguan"></div>
                                <div className="flex">四川</div>
                            </div>
                            <div className="item titlecss"> 
                                <div className="mark iconfont icon-mingzu"></div>
                                <div className="flex">汉族</div>
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-jiaoyujingli"></div>
                                <div className="flex">本科</div>
                            </div>
                            
                            <div className="item">
                                <div className="mark iconfont icon-xuexiao"  style={{color:'red'}}></div>
                                <div className="flex">昆明理工大学</div>
                            </div>
                            <div className="item  titlecss">
                                <div className="mark iconfont icon-zhuanye"  style={{color:'#00CACA'}}></div>
                                <div className="flex">材料科学与工程</div>
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-gongzuoshangban"></div>
                                <div className="flex">4年</div>
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-phone"></div>
                                <div className="flex">15877924089</div>
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-weixin" style={{color:'green'}}></div>
                                <div className="flex">Icyziyou</div>
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-email"></div>
                                <div className="flex">majuan525@qq.com</div>
                            </div>
                            <div className="item">
                                <div className="mark iconfont icon-qq"></div>
                                <div className="flex">391914091</div>
                            </div>
                            <div className="item">
                                <div className="mark  iconfont icon-closeyihuifu-"></div>
                                <div className="flex">杭州市西湖区五常港路西庐19幢2单元</div>
                            </div>
                            
                        </div>
                        
                    </div>
                </Scroller>
                

                {/* <List
                    ref="list"
                    extraClass="flex m-list"
                    dataSource={this.state.dataSource}
                    renderItem={(item, i) => <div className="item"><div className="mark">{i}</div><div className="flex">{item.text}</div></div>}
                    infinite={true}
                    infiniteSize={20}
                    itemHeight={44}
                    usePullRefresh={true}
                    onRefresh={() => {
                        setTimeout(() => {
                            this.refresh();
                            this.refs.list.stopRefreshing(true);
                        }, 500);
                    }}
                    useLoadMore={true}
                    onLoad={() => {
                        setTimeout(() => {
                            this.fetch();
                            this.refs.list.stopLoading(true);
                        }, 500);
                    }}
                    itemExtraClass={(item, i) => {
                        return 'item ' + i;
                    }}
                    onItemTap={(item, i, ds) => {
                        yoHistory.push('/detail');
                    }}
                /> */}
                <Footer left={false}/>
            </div>
        )
    }
}

// let guid = -1;

// function getArrayByLength(length) {
//     var ret = [];
//     for (var i = 0; i < length; i++) {
//         ret[i] = null;
//     }
//     return ret;
// }

// function getRandomList(size) {
//     return getArrayByLength(size).fill(1).map(num => parseInt(Math.random() * 100));
// }

// function getRandomDataSource(size) {
//     return getRandomList(size).map(num => ({ text: num, key: ++guid }));
// }


export default My;

